<template>
  <div id="app" class="app-page">
    <root>
      <safe-header
        v-bind="{
          title: '到货暂收列表',
          isBack: true,
          backIconColor: '#fff',
          fixedTop: true,
        }"
      />
      <div>
        <!--<v-container>
          <v-row>
            <v-col :cols="12" class="pb-0">
               <v-autocomplete
              v-model="value"
              color="white"
              item-text="name"
              item-value="id"
              label="State"
              hide-details
              :items="states"
              :filter="customFilter"
              @change="chooseConditions"
              ></v-autocomplete>
              <v-text-field
                dense
                :prepend-inner-icon="mdiMagnify"
                v-model="value"
                solo
                hide-details
                placeholder="请输入入库单号进行查询"
                @input="chooseConditions"
                style="font-size: 14px"
              ></v-text-field>
            </v-col>
          </v-row>
        </v-container>-->
        <v-container width:80%>
          <v-card
            class="mx-auto my-2 list_card"
            max-width="374"
            v-for="item in warehouseOrderList"
            :key="item.code"
            outlined
            @click="warehouseOrderClick(item)"
            style="board: thin solid #cacbcc"
          >
            <v-card-title class="pb-3 card-title">
              <v-row>
                <v-col cols="12" class="py-0 d-flex align-center">
                  {{ item.billNo }}
                  <span class="ms-2 card-tag">{{ item.statesLabel }}</span>
                  <span class="ms-2 card-tag" style="position: absolute;right: 0;">
                    <v-btn
                      style="
                        background-color: #627aec;
                        height: 100%;
                        border-radius: 5px;
                        margin-left: 20px;
                        color: #fff;
                      "
                      @click.stop="allReceiving(item)"
                    >全部收货</v-btn>
                    <v-icon color="#CACBCC">{{ svgpath }}</v-icon>
                  </span>
                </v-col>
                <!-- <v-col
                  class="text-right py-0 pr-0 d-flex align-center justify-end"
                >
                  <v-icon color="#CACBCC">{{ svgpath }}</v-icon></v-col
                >-->
              </v-row>
            </v-card-title>

            <v-divider class="my-0 card-sp-line"></v-divider>

            <v-card-text>
              <v-row class="d-flex flex-row justify-space-between">
                <v-col cols="3" class="py-1 card-lable">创建时间</v-col>
                <v-col class="ms-2 py-1 text-right card-value">{{ item.createTime }}</v-col>
              </v-row>
              <v-row>
                <v-col cols="3" class="py-1" style="color: #999999">供应商</v-col>
                <v-col
                  class="ms-2 py-1 text-right"
                  style="font-size: 0.75rem; color: #666666"
                >{{ item.supplierName }}</v-col>
              </v-row>
            </v-card-text>
          </v-card>
        </v-container>
      </div>
      <!-- <v-dialog v-model="isQBSH" min-width="344">
        <v-card class="mx-auto" max-width="344">
          <v-card-title class="text-h5">提 示</v-card-title>
          <v-card-text>
            <p></p>
            <div class="text--primary">确定进行全部收货</div>
          </v-card-text>
          <v-card-actions>
            <v-spacer></v-spacer>
            <v-btn class="ma-2" text color="indigo" @click="isQBSH = false">取消</v-btn>
            <v-btn class="ma-2" text color="teal" @click="isConfirm()">确认</v-btn>
          </v-card-actions>
        </v-card>
      </v-dialog>-->
    </root>
  </div>
</template>

<script>
import SafeHeader from "../../components/safeHeader_wms";
import Storage from "@/utils/storage.js";
import wms from "../../utils/http.js";
import { apiList } from "@/static/apiList";
import { mdiChevronRight, mdiMagnify } from "@mdi/js";
import Root from "@/components/Root.vue";
// import qs from "qs";

export default {
  name: "ArrivalProvisionalReceipt_OrderList",
  components: {
    SafeHeader,
    Root
  },
  data() {
    return {
      svgpath: mdiChevronRight,
      mdiMagnify: mdiMagnify,
      value: "",
      states: [
        { name: "NCONV1001841201612", id: "NCONV1001841201612" },
        { name: "NCONV1001841201613", id: "NCONV1001841201613" },
        { name: "NCONV1001841201614", id: "NCONV1001841201614" },
        { name: "NCONV1001841201615", id: "NCONV1001841201615" },
        { name: "NCONV1001841201616", id: "NCONV1001841201616" }
      ],
      // infoList: [],
      warehouseOrderList: [],
      subForm: {
        billNo: "",
        supplierName: "",
        wareId: "",
        wareName: ""
      }
      // // 全部收货确认框标识
      // isQBSH: false,
      // // 全部收货方法执行标识
      // isallReceiving: false,
      // // 全部收货过度数据
      // ShItem: null
    };
  },
  computed: {},
  methods: {
    // // 确认全部收货
    // isConfirm() {
    //   // 关闭弹框
    //   this.isQBSH = false;
    //   // 执行全部收货方法
    //   this.isallReceiving = true;
    //   this.allReceiving(this.ShItem);
    // },
    // 收货按钮
    allReceiving(item) {
      // if (confirm("确认全部合格"))
      console.log(item);
      if (confirm("确认全部收货")) {
        this.subForm.billNo = item.billNo;
        this.subForm.wareName = item.wareName;
        this.subForm.wareId = item.wareId;
        let params = {
          isOperByPda: true,
          asnBillNo: this.subForm.billNo,
          wareName: this.subForm.wareName,
          wareId: this.subForm.wareId
        };
        wms
          .post({ url: "/accept/records/pdaBatchAccept", data: params })
          .then(res => {
            console.log(res);
            if (res.data.code == 200) {
              //刷新页面
              window.location.reload();
            }
          });
      } else {
        window.location.reload();
      }
    },
    customFilter(item, queryText) {
      // 选择项   输入的查询字段   显示值(name)
      const textOne = item.name.toLowerCase();
      const textTwo = item.abbr.toLowerCase();
      const searchText = queryText.toLowerCase();
      return (
        textOne.indexOf(searchText) > -1 || textTwo.indexOf(searchText) > -1
      );
    },
    // 当前选中值发生变化时
    chooseConditions(text) {
      // 更改下方列表
      this.warehouseOrderList = this.infoList.filter(item => {
        if (item.code.includes(text)) {
          return item;
        }
      });
    },
    // 获取列表
    getListData() {
      console.log(123);
    },
    warehouseOrderClick(item) {
      console.log(`----------------------------------------${item.billNo}`);
      if (window.navigator.userAgent.toLowerCase().includes("apicloud")) {
        window.api.sendEvent({
          name: "ArrivalProvisionalReceipt",
          extra: {
            billNo: item.billNo
          }
        });
        window.api.openWin({
          name: "ArrivalProvisionalReceipt",
          url: "./ArrivalProvisionalReceipt.html",
          pageParam: {
            billNo: item.billNo
          }
        });
      } else {
        this.$root.api.api.sendEvent({
          name: "ArrivalProvisionalReceipt",
          extra: {
            billNo: item.billNo
          }
        });
        this.$root.api.api.openWin({
          name: "ArrivalProvisionalReceipt",
          url: "./ArrivalProvisionalReceipt.html",
          pageParam: {
            billNo: item.billNo
          }
        });
      }
    }
  },
  mounted() {
    console.log(11);
    // let itemCode = window.api.pageParam.itemCode;
    // console.log("itemCode:" + itemCode);
    let agreementNo = this.$root.api.api.pageParam.agreementNo;
    let params = {
      wareId: Storage.getObject("loginConfig").wareIds[0],
      asnState: 0,
      insertType: 0,
      asnType: 24,
      pageSize:999,
    };
    // console.log("params:" + params);
    // if (itemCode) {
    //   let params2 = { itemCode: itemCode };
    //   wms
    //     .get({ url: "/asn/details/listByItemCode", data: params2 })
    //     .then((res) => {
    //       console.log(JSON.stringify(res.data.data));
    //       this.infoList = res.data.data.list;

    //       let asnStates = apiList.asnStates;
    //       this.infoList.forEach((item) => {
    //         asnStates.forEach((val) => {
    //           if (item.asnState == val.value) {
    //             item.statesLabel = val.label;
    //           }
    //         });
    //       });
    //       this.warehouseOrderList = this.infoList;
    //     });
    // } else {
    // 执行默认的源单查询代码
    // }
    // 根据履约号查询
    if (agreementNo) {
      let params2 = { agreementNo: agreementNo };
      wms
        .get({ url: "/asn/details/listByItemCode", data: params2 })
        .then(res => {
          console.log(JSON.stringify(res.data.data));
          this.infoList = res.data.data.list;
          let asnStates = apiList.asnStates;
          this.infoList.forEach(item => {
            asnStates.forEach(val => {
              if (item.asnState == val.value) {
                item.statesLabel = val.label;
              }
            });
          });
          this.warehouseOrderList = this.infoList;
        });
    } else {
      wms.get({ url: "/asn/masters/pdaList", data: { params } }).then(res => {
        console.log(res);
        this.infoList = res.data.data.list;
        let asnStates = apiList.asnStates1;
        this.infoList.forEach(item => {
          asnStates.forEach(val => {
            if (item.asnState == val.value) {
              item.statesLabel = val.label;
            }
          });
        });
        this.warehouseOrderList = this.infoList;
      });
    }
  }
};
</script>

<style lang="scss" scoped>
.col-xl,
.col-xl-auto,
.col-xl-12,
.col-xl-11,
.col-xl-10,
.col-xl-9,
.col-xl-8,
.col-xl-7,
.col-xl-6,
.col-xl-5,
.col-xl-4,
.col-xl-3,
.col-xl-2,
.col-xl-1,
.col-lg,
.col-lg-auto,
.col-lg-12,
.col-lg-11,
.col-lg-10,
.col-lg-9,
.col-lg-8,
.col-lg-7,
.col-lg-6,
.col-lg-5,
.col-lg-4,
.col-lg-3,
.col-lg-2,
.col-lg-1,
.col-md,
.col-md-auto,
.col-md-12,
.col-md-11,
.col-md-10,
.col-md-9,
.col-md-8,
.col-md-7,
.col-md-6,
.col-md-5,
.col-md-4,
.col-md-3,
.col-md-2,
.col-md-1,
.col-sm,
.col-sm-auto,
.col-sm-12,
.col-sm-11,
.col-sm-10,
.col-sm-9,
.col-sm-8,
.col-sm-7,
.col-sm-6,
.col-sm-5,
.col-sm-4,
.col-sm-3,
.col-sm-2,
.col-sm-1,
.col,
.col-auto,
.col-12,
.col-11,
.col-10,
.col-9,
.col-8,
.col-7,
.col-6,
.col-5,
.col-4,
.col-3,
.col-2,
.col-1 {
  padding: 7px;
}
</style>
